<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Blueprint Sample Page</title>

  <!-- Framework CSS -->
	<link rel="stylesheet" href="Blueprint/blueprint/screen.css" type="text/css" media="screen, projection">
	<link rel="stylesheet" href="Blueprint/blueprint/print.css" type="text/css" media="print">
  <!--[if IE]><link rel="stylesheet" href="Blueprint/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->

	
	<!-- Import fancy-type plugin for the sample page. -->
	<link rel="stylesheet" href="Blueprint/blueprint/plugins/fancy-type/screen.css" type="text/css" media="screen, projection">
</head>

<body>

<div class="container">
    <div class="span-24">
        <h1>VIPS Test</h1>
		<img src="Example_files/header.jpg" class="" alt="test"/>
    </div>
    <div class="span-5 box">
		<h2>Sidebar</h2>
		<div class='widget-content'>
		<ul>
		<li><a href='http://www.google.com/'>Web Search</a></li>

		<li><a href='http://downloads.google.com/'>Downloads</a></li>
		<li><a href='http://images.google.com/'>Image Search</a></li>
		<li><a href='http://maps.google.com/'>Maps</a></li>
		<li><a href='http://labs.google.com/'>Labs</a></li>
		<li><a href='http://news.google.com/'>News</a></li>
		<li><a href='http://www.google.com/press/zeitgeist.html'>Zeitgeist</a></li>
		<li><a href='http://mobile.google.com/'>Mobile</a></li>
		<li><a href='http://www.google.com/options/'>More...</a></li>
		</ul></div>
	
	</div>
    <div class="span-12">
			<h2>Column Three</h2>

			<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec eget quam sit amet mauris consequat iaculis. Cras vitae massa quis nunc feugiat lobortis. Morbi ornare rhoncus eros. </p>
			<h3>Rapid</h3>
			<p>Mauris fermentum feugiat justo. Quisque urna dolor, sollicitudin id, congue sed. <a href="#">Euismod a ante</a>. </p>
			<h3>Griddy</h3>
			<p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae. <a href="#">Vestibulum arcu</a>.</p>

			<h3>Clean</h3>
			<p>Nulla purus eros, placerat at, rutrum ac, tincidunt quis, neque. Aliquam gravida tempus nibh. Aenean eleifend facilisis nisi. Aliquam erat volutpat. <a href="#">Fusce ac nisl.</a></p>
			<h3>Simple</h3>
			<p>Nullam sollicitudin convallis velit. Vestibulum magna lacus, adipiscing vitae, sagittis in. <a href="#">Porttitor non, nulla</a>. </p>

    </div>
	
    <div class="span-5 last box">
		<h2>Sidebar</h2>
		<div class='widget-content'>
		<ul>
		<li><a href='http://www.google.com/'>Web Search</a></li>

		<li><a href='http://downloads.google.com/'>Downloads</a></li>
		<li><a href='http://images.google.com/'>Image Search</a></li>
		<li><a href='http://maps.google.com/'>Maps</a></li>
		<li><a href='http://labs.google.com/'>Labs</a></li>
		<li><a href='http://news.google.com/'>News</a></li>
		<li><a href='http://www.google.com/press/zeitgeist.html'>Zeitgeist</a></li>
		<li><a href='http://mobile.google.com/'>Mobile</a></li>
		<li><a href='http://www.google.com/options/'>More...</a></li>
		</ul></div>
	
	</div>
	
    <div class="span-24">
        <p class="success">Footer</p>
    </div>
</div>


</body>
</html>